Add Back to top block #50600
Closed
Add Back to top block #50600
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
Size Change: +247 B (0%) Total Size: 1.7 MB
ℹ️ View Unchanged
|
carolinan
requested review from
spacedmonkey,
ajitbohra,
ryanwelcher,
juanmaguitar,
fabiankaegy and
ndiego
as code owners
|
@carolinan Is this only a scroll function being used here? If so, you need to find a way to manage focus after the scroll transition for screen readers or the link will be entirely useless for accessibility. Something like this? That would place focus on the first link after the opening Thanks. |
|
Maybe an ID could be added to the automated skip to content link, and that could be the target. |
|
@carolinan Sounds good. In that case, we'd have to restrict this block to block themes only I guess so that way we know for sure the ID will be on the skip link. |
|
Sigh, there is always something 😆 |
I hear that, hashtag LifeOfDevs. |
|
I have added a basic viewScript. It doesn't contain any "scroll to" functionality, it only moves focus when clicking on the back to top block. |
|
should smooth control be included directly as an option? Not sure how easy it is to implement, though. |
alexstine
reviewed
May 19, 2023
This comment was marked as outdated.
This comment was marked as outdated.
This comment was marked as outdated.
This comment was marked as outdated.
This comment was marked as outdated.
This comment was marked as outdated.
|
This pull request has changed or added PHP files. Please confirm whether these changes need to be synced to WordPress Core, and therefore featured in the next release of WordPress. If so, it is recommended to create a new Trac ticket and submit a pull request to the WordPress Core Github repository soon after this pull request is merged. If you're unsure, you can always ask for help in the #core-editor channel in WordPress Slack. Thank you! ❤️ View changed files❔ lib/blocks.php |
This comment was marked as outdated.
This comment was marked as outdated.
|
@beafialho @WordPress/gutenberg-design @mtias It has been a couple of months without reviews, change requests or comments, is this still a block that is on the roadmap, that we want to include? |
|
This looks good to me. Adding a bit of (likely late) feedback: perhaps in an upcoming iteration the block can eventually evolve into “button” territory to surface some of the design references described in this issue. It seems like making it a button is a little less about the semantics, and more about the block supports (position, background, padding, radius, text color, etc.). Even if there's no possibility to add an icon soon, it could be useful to be able to customize the text "Back to top", make it sticky, etc. |
|
Agreed with Bea, if the current iteration does not preclude us from future customization supports, I could see a first version landing of this. Thanks for the work! |
|
Forgive my naivety but why does this need to be a dedicated block? It's reasonably straight-forward to link any text (or button) to |
|
Could we instead just add an option to the Buttons block? |
|
The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message. To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
|
Closing this as not planned. |
|
Hi I have been looking at this feature again.... I added my above comment thinking that we could add simple ways to a link or Button block but I am starting to change my mind. I am wondering if including a native Gutenberg block could be a good idea. As it keeps it simple and straight forward and it is a feature used a lot in posts that have long layouts. Over time it could also be adjusted based on additional needs for this specific block. Should we reopen? |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
What?
Updated October 11.
Adds a basic block with a paragraph containing a link that takes you to the top of the browser window.
Fixes #50433
Why?
From the issue:
"The popularity of responsive web design has led to a proliferation of single-column, long-page designs both on mobile and desktop. A consequence of these designs has been the Back to Top button, which is a shortcut that allows users to quickly navigate to the top of the page."
How?
Adds a new block called Back to top.
wp-block-back-to-top, is added to front of the website so that the block always have a target on the page.Considerations
Testing Instructions
Updated Testing Instructions for keyboard
Screenshots or screencast
back.to.top.mp4